<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>drawimage</title>
    <script type="text/javascript">
        window.onload=function () {
            document.getElementById("cut").onclick=function () {
                var ov=document.getElementById("video1");
                var can=document.getElementById("my");
                var con=can.getContext("2d");
                con.drawImage(ov ,0,0,320,176);
            }
        }
    </script>
</head>
<body>
<video controls="controls" autoplay="autoplay" id="video1">
    <source src="../other/mov_bbb.mp4" type="video/mp4">
    <source src="../other/mov_bbb.webm" type="video/webm">
    <source src="../other/mov_bbb.ogv" type="video/ogg">
</video><br>
<input type="button" id="cut" value="截图"><br>
<canvas id="my" width="320px" height="176px">123456</canvas>
</body>
</html>